<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>绘制一个点-固定</title>
  </head>
  <body>
    <canvas width="800" height="600" id="glcanvas"
      >browser don't support canvas</canvas
    >

    <script src="../lib/webgl-utils.js"></script>
    <script src="../lib/webgl-debug.js"></script>
    <script src="../lib/cuon-utils.js"></script>

    <script>
      var VSHADER_SOURCE = `
            void main(){
                gl_Position = vec4(0.0, 0.0, 0.0, 1.0);
                gl_PointSize = 10.0;
            }
        `;

      var FSHADER_SOURCE = `
            void main(){
                gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0);
            }
        `;

      /** @type {HTMLCanvasElement} */
      var canvas = document.getElementById("glcanvas");

      var gl = getWebGLContext(canvas);
      if (!gl) {
        throw new Error("can't get webgl context");
      }

      if (!initShaders(gl, VSHADER_SOURCE, FSHADER_SOURCE)) {
        throw new Error("can't init shader");
      }

      gl.clearColor(0.0, 0.0, 0.0, 1.0);
      gl.clear(gl.COLOR_BUFFER_BIT);
      gl.drawArrays(gl.POINTS, 0, 1);
    </script>
  </body>
</html>
